<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@page import="java.util.List"%>
<%@page import="ru.miit.elearning.hibernate.dto.CurriculumLevel"%>
<%--
    Document   : labs.jsp
    Created on : 19.11.2008, 15:33:27
    Author     : Cyclone
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<body>
    <script src="js/labs.js" type="text/javascript"></script>
    <script src="datatable/jquery.dataTables.js" type="text/javascript"></script>

    <%@include file="systemMessage.jsp" %>

    <div id="box" class="rounded-divcascade">
        <div id="rightnow">
            <h3 class="reallynow" style="border: 0px;">
                <span>Практические работы</span>
                <a class="add" href="#addLab" onmousedown="document.getElementById('labTitle').focus();">Добавить работу</a>
                <br/>
            </h3>
        </div>

        <form id="form" class="rounded-formcascade">
            <fieldset>
                <center>
                    <c:choose><c:when test="${cookie.list.value == 'plain'}">
                            <input type="button" id="button1" onclick="switchList('group');" style="width: 60%;" value="Переключиться на сгруппированный список" />
                        </c:when><c:otherwise>
                            <input type="button" id="button2" onclick="switchList('plain');" style="width: 60%;" value="Переключиться на простой список" />
                        </c:otherwise></c:choose>
                    </center>
                <c:choose><c:when test="${cookie.list.value == 'plain'}">

                        <table width="100%" id="plainLabsTable" align="left" class="datatable">
                            <thead>
                                <tr>
                                    <c:if test="${sessionScope.roles.admin || sessionScope.roles.tutor}">
                                        <th width="40px"><a href="#">ID</a></th>
                                    </c:if>
                                    <th width="40px"><a href="#">№</a></th>
                                    <th><a href="#">Название</a></th>
                                    <th><a href="#">Курс<img src="img/icons/arrow_down_mini.gif" width="16" height="16" align="absmiddle" /></a></th>
                                    <th width="80px"><a href="#">Описание</a></th>
                                    <th width="80px"><a href="#">Операции</a></th>
                                </tr>
                            </thead>
                            <tbody>

                                <c:if test="${!empty labList}">
                                    <c:forEach var="lab" items="${labList}">

                                        <tr>
                                            <c:if test="${sessionScope.roles.admin || sessionScope.roles.tutor}">
                                                <td class="a-center">${lab.id}</td>
                                            </c:if>
                                            <td>${lab.numeral}</td>
                                            <td><a href="Lab?id=${lab.id}" title="Подробнее практической работе">${lab.title}</a></td>
                                            <td><a href="Course?id=${lab.curriculumLevel.id}" title="Подробнее о курсе">${lab.curriculumLevel.title}</a></td>

                                            <td style="padding: 0px;"><input type="button" value="Просмотр" onclick="showDescription(${lab.id});" style="width:98%;"/></td>
                                            <td style="padding: 0px;">
                                                <select id="actionSelect"  style="width:98%;" onchange="actionSelectChange(event, ${lab.id}, '${fn:escapeXml(lab.title)}');">
                                                    <%--                                                <select id="actionSelect" onchange="actionSelectChange(event, ${lab.id}, '${lab.title}')" style="width:98%;"> --%>
                                                    <option value="-1" selected>...</option>
                                                    <optgroup label="Общие">
                                                        <option value="1">Изменить</option>
                                                        <option value="2">Удалить</option>
                                                    </optgroup>
                                                </select>
                                            </td>
                                        </tr>

                                    </c:forEach>
                                </c:if>

                            </tbody>
                        </table>
                    </c:when><c:otherwise>
                        <!-- groupped list -->


                        <legend>
                            <a>Практические работы сгруппированы по курсам</a>
                        </legend>


                        <c:forEach items="${courseList}" var="course">

                            <div id="rightnow" onclick="toggleLabsDiv(${course.id});" style="cursor: help;">
                                <h3 class="reallynow">
                                    <span>${course.title}</span>
                                    <a class="search_page" onclick="detailsClicked(event);" href="Course?id=${course.id}">О курсе</a>
                                    <!--                <a class="add" onclick="$('#labsDiv_21').toggle();alert('hello');">Свернуть</a>-->
                                    <br/>
                                </h3>
                            </div>

                            <div id="labsDiv_${course.id}" style="display: none;">
                                <label style="margin-top: 8px;" >Направление : </label>
                                <input type="text" value="${course.curriculumLevel.title}" readonly="readonly" style="margin-top: 5px; margin-bottom: 0px;" />

                                <c:choose><c:when test="${!empty course.labList}">
                                        <table width="100%">
                                            <thead>
                                                <tr>
                                                    <c:if test="${sessionScope.roles.admin || sessionScope.roles.tutor}">
                                                        <th width="40px">ID</th>
                                                    </c:if>
                                                    <th width="40px">№<img src="img/icons/arrow_down_mini.gif" width="16" height="16" align="absmiddle" /></th>
                                                    <th>Название практической работы</th>
                                                    <th width="80px">Описание</th>
                                                    <th width="80px">Операции</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <c:forEach items="${course.labList}" var="lab">
                                                    <tr>
                                                        <c:if test="${sessionScope.roles.admin || sessionScope.roles.tutor}">
                                                            <td class="a-center">${lab.id}</td>
                                                        </c:if>
                                                        <td>${lab.numeral}</td>
                                                        <td><a href="Lab?id=${lab.id}" title="Подробнее о практической работе">${lab.title}</a></td>

                                                        <td style="padding: 0px;"><input type="button" value="Просмотр" style="width: 98%;" onclick="showDescription(${lab.id});"/></td>
                                                        <td style="padding: 0px;">
                                                            <select id="actionSelect" onchange="actionSelectChange(event, ${lab.id}, '${fn:escapeXml(lab.title)}');" style="width: 98%;">
                                                                <option value="-1" selected>...</option>
                                                                <optgroup label="Общие">
                                                                    <option value="1">Подробнее</option>
                                                                    <option value="2">Удалить</option>
                                                                </optgroup>
                                                            </select>
                                                        </td>
                                                    </tr>
                                                </c:forEach>
                                            </tbody>
                                        </table>
                                    </c:when><c:otherwise>
                                        <p>Список практических работ пуст</p>
                                        <input type="button" value="Редактировать курс" onclick="window.location = 'Course?id=${course.id}'" />
                                    </c:otherwise></c:choose>
                                </div>


                        </c:forEach>

                        <script type="text/javascript">reopenLabsDiv();</script>

                    </c:otherwise></c:choose>


                </fieldset>
            </form>


            <form id="form" action="AddLab" name="addLabForm" method="post" class="rounded-formcascade">
                <fieldset>
                    <legend>
                        <a name="addLab">Добавление новой практической работы</a>
                    </legend>
                    <label for="labTitle">
                        Название :
                    </label>
                    <input name="labTitle" id="labTitle" type="text" tabindex="1" />
                    <br/>
                    <label for="direction">
                        Направление :
                    </label>
                    <select id="directionSelect" tabindex="2" name="directionId" onchange="directionSelectChange();" tabindex="3">
                        <option value="-1">Выберите направление</option>

                    <c:choose><c:when test="${!empty param.predefDirectionId}">
                            <!-- selecting predefined option -->
                            <c:forEach var="direction" items="${directionList}">
                                <c:choose><c:when test="${param.predefDirectionId == direction.id}">
                                        <option value="${param.predefDirectionId}" selected="selected" >${direction.title}</option>
                                        <%--<script>alert(document.getElementById("directionSelect").value);</script>--%>
                                    </c:when><c:otherwise>
                                        <option value="${direction.id}" >${direction.title}</option>
                                    </c:otherwise></c:choose>
                            </c:forEach>
                        </c:when><c:otherwise>
                            <!-- no predefined options -->
                            <c:forEach var="direction" items="${directionList}">
                                <option value="${direction.id}">${direction.title}</option>
                            </c:forEach>
                        </c:otherwise>
                    </c:choose>
                </select>
                <br/>

                <!--                <label for="course" style="display: none;" id="courseLabel" tabindex="4">-->
                <label for="course" id="courseLabel">
                    Курс :
                </label>
                <c:if test="${empty param.predefCourseId}">
                    <input type="text" id="inputChooseCourse" disabled="disabled" value="Список курсов определяется по направлению" />
                </c:if>

                <%
                            List<CurriculumLevel> directionList = (List<CurriculumLevel>) request.getAttribute("directionList");
                            for (CurriculumLevel direction : directionList) {
                                out.write("<div id=\"courseSelectDiv_" + direction.getId() + "\" style=\"display: none;\">");
                                out.write("<select id=\"courseSelect_" + direction.getId() + "\" tabindex=\"3\" name=\"courseId_" + direction.getId() + "\" onchange=\"courseSelectChange(" + direction.getId() + ");\"");
                                out.write("<option value=\"-1\">Выберите курс</option>");
                                List<CurriculumLevel> courseList = (List<CurriculumLevel>) request.getAttribute("courseList_" + direction.getId());

                                Integer predefinedCourseId = null;
                                try {
                                    String predefinedCourseIdString = request.getParameter("predefCourseId");
                                    if (predefinedCourseIdString != null) {
                                        predefinedCourseId = Integer.parseInt(predefinedCourseIdString);
                                    }

                                } catch (Exception e) {
                                    System.err.println("Smth wrong with predefCourseId");
                                    e.printStackTrace();
                                }

                                if (predefinedCourseId == null) {
                                    for (CurriculumLevel course : courseList) {
                                        out.write("<option value=\"" + course.getId() + "\">" + course.getTitle() + "</option>");
                                    }
                                } else {
                                    for (CurriculumLevel course : courseList) {
                                        out.write("<option " + (predefinedCourseId.equals(course.getId()) ? "selected=\"selected\" " : "") + "value=\"" + course.getId() + "\">" + course.getTitle() + "</option>");
                                    }
                                }

                                out.write("</select>");
                                out.write("</div>");
                            }
                %>

                <!-- make one of courseSelectDiv visible because of predefined initial parameters from other page -->
                <c:if test="${!empty param.predefDirectionId}">
                    <script>
                        var divId = "courseSelectDiv_"+${param.predefDirectionId};
                        document.getElementById(divId).style.display = "";
                        visibleDivId = ${param.predefDirectionId};
                    </script>
                </c:if>

                <label for="labNumber">
                    Номер :
                </label>
                <input name="labNumber" id="labNumber" type="text" tabindex="4" value="${param.predefNumber}"  style="width: 210px;" />
                <span>(указывать необязательно)</span>
                <br/>

                <label for="description">
                    Описание :
                </label>
                <textarea name="description" class="taWysiwyg" style="height: 50px;" id="textAreaDescription"tabindex="5" onmouseover="textAreaFocus()" onmouseout="textAreaBlur()"></textarea>
                <br/>
                <a href="javascript:" class="goWysiwyg">форматировать текст</a>
            </fieldset>
            <input type="hidden" id="courseIdInput" name="courseId" value="-1"/>
            <div align="center">
                <input id="button1" type="button" value="Добавить" tabindex="6" onclick="addLabFormValidate();"/>
                <input id="button2" type="reset" value="Очистить" tabindex="7" onclick="addLabFormReset();"/>
            </div>
        </form>

    </div>
    <script type="text/javascript">
        $(document).ready(function(){
            $("#liLabs").addClass("current");
            $('div#top-panel p').text('Практические работы по дистанционным курсам');

            try {
                doDatatable('plainLabsTable')
            } catch(e){}
            

        <%--var defaultVal = 'Введите описание практической работы';
        $("#textAreaDescription").focus(function(){
            if(this.value == defaultVal){
                this.value = '';
            }
        }).blur(function(){
            if(this.value == ''){
                this.value = defaultVal;
            }
        });--%>
            });
    </script>
</body>

